<template>
  <div>
    <div ref="factor" style="height: 600px;width: 1000px"></div>
  </div>
</template>

<script>
import * as echarts from "echarts";
import {findAllTripsStation} from '../../../http/request'
import {forEach} from "@/libs/tools";

export default {
  name: "index",
  data() {
    return {
      data: [],
      links: []
    }
  },
  mounted() {
    findAllTripsStation().then(res => {
      console.log(res)
      var arr = []
      for (let i in res.data) {
        arr.push(res.data[i].sta_in)
        arr.push(res.data[i].sta_out)
      }
      var narr = this.uniq(arr)
      console.log(narr)

      for (let i in narr) {
        var name = narr[i]
        this.data.push({name})
      }
      for (let i in res.data) {
        var source = res.data[i].sta_in
        var target = res.data[i].sta_out
        var value = res.data[i].sta_num
        this.links.push({source, target, value})
      }
      console.log(this.data);
      console.log(this.links);
      this.sankeyDiagram()
    })
    this.sankeyDiagram()
  },
  methods: {
    sankeyDiagram() {
      let lineGraph = echarts.init(this.$refs.factor)
      lineGraph.setOption({
        color: ['#5470c6','#91cc75','#fac858','#ee6666','#73c0de','#3ba272','#fc8452','#9a60b4','#ea7ccc'],
        series: {
          type: 'sankey',
          layout: 'none',
          emphasis: {
            focus: 'adjacency'
          },
          data: this.data,
          links: this.links,
          lineStyle: {
            color: 'source',
            curveness: 0.5
          }
        }
      })
    },
    uniq(array) {
      var temp = {}, r = [], len = array.length, val, type;
      for (var i = 0; i < len; i++) {
        val = array[i];
        type = typeof val;
        if (!temp[val]) {
          temp[val] = [type];
          r.push(val);
        } else if (temp[val].indexOf(type) < 0) {
          temp[val].push(type);
          r.push(val);
        }
      }
      return r;
    }

  }
}
</script>

<style scoped>

</style>
